@mixin size($w, $h){
	width: $w;
	height: $h;
}

@mixin flex-center(){
	justify-content: center;
	align-items: center;
}

@mixin position-center(){
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

$spaces: (
	0:0, 
	5:3.47rpx, 
	10:6.94rpx, 
	15:10.42rpx, 
	20:13.89rpx, 
	25:17.36rpx, 
	30:20.83rpx, 
	35:24.31rpx, 
	40:27.78rpx, 
	45:31.25rpx, 
	50:34.72rpx
);

@each $key,$value in $spaces {
  .mr#{$key} {
    margin-right: $value;
  }
  .ml#{$key} {
    margin-left: $value;
  }
  .mt#{$key} {
    margin-top: $value;
  }
  .mb#{$key} {
    margin-bottom: $value;
  }
  .pb#{$key} {
    padding-bottom: $value;
  }
  .pt#{$key} {
    padding-top: $value;
  }
  .pl#{$key} {
    padding-left: $value;
  }
  .pr#{$key} {
    padding-right: $value;
  }
}